<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
    <title>hello world</title>
    <link rel="stylesheet" type="text/css" href="css/index.css"/>
    <script src="js/flexible.debug.js" type="text/javascript" charset="utf-8"></script>
    <script src="js/flexible_css.debug.js" type="text/javascript" charset="utf-8"></script>
    <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
    <script type="text/javascript">
    	
    </script>
    <style type="text/css">
    	.bj{
    		background: #939393;
    	}
    	.header {
  height: 1.06666667rem;
  background: linear-gradient(#ef0000, #a60000);
  display: flex;
  justify-content: space-between;
  align-items: center;
  color: #FFFFFF;
  font-size: 0.54666667rem;
}
.header .zuo img {
  height: 0.53333333rem;
  padding-left: 0.13333333rem;
}
.anniu {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 0.93333333rem;
  background: #f3f2f2;
}
.anniu .button button {
  margin-right: 0.06666667rem;
  font-size: 0.18666667rem;
  border-radius: 0.13333333rem;
  padding-left: 0.13333333rem;
  padding-right: 0.13333333rem;
}
.anniu .button button img {
  height: 0.2rem;
}
    </style>
</head>
<body>
	<header class="header">
		<div class="zuo">
			<img src="img/tu2.png">
		</div>
		<div class="you">芬迪</div>
		<div class="zong"></div>
	</header>
	<div class="anniu">
		<div class="button">
		<button>默认</button>	
		<button>
			销量<img src="img/tu8.png">
		</button>	
		<button>
			价格<img src="img/wu-xia.png">
		</button>
		</div>
	</div>
	<div class="duo"></div>
	<div class="tab">
		<a href="#">
			<img src="img/index-shou.png"/>
			<p>首页</p>
		</a>
		<a href="#">
			<img src="img/index-sou.png"/>
			<p>搜索</p>
		</a>
		<a href="#">
			<img src="img/index-xiu.png"/>
			<p>我的秀</p>
		</a>
		<a href="#">
			<img src="img/index-gou.png"/>
			<p>购物车</p>
		</a>
		<a href="#">
			<img src="img/index-geng.png"/>
			<p>更多</p>
		</a>
		
		
	</div>
	<script src="js/jquery-1.12.4.min.js" type="text/javascript" charset="utf-8"></script>
	<script src="js/quanju.js" type="text/javascript" charset="utf-8"></script>
	<script type="text/javascript">
			$('.tab a').eq(0).addClass('taba').children('img').attr("src","img/binindex-xiu.png")

	$('.duo').load('wu.html')
	$('.anniu button').eq(0).addClass('bj');
		$('.anniu button').eq(0).click(function(){
			$(this).addClass('bj').siblings().removeClass('bj')
		$('.duo').load('wu.html')
		})
		$('.anniu button').eq(1).click(function(){
			$(this).addClass('bj').siblings().removeClass('bj')
		$('.duo').load('liu.html')
		})
		$('.anniu button').eq(2).click(function(){
			$(this).addClass('bj').siblings().removeClass('bj')
		$('.duo').load('qi.html')
		})
	
		
	</script>
</body>
</html>